<div bsModal #createOrEditModal="bs-modal" (onShown)="onShown()" class="modal fade" tabindex="-1" role="dialog"
    aria-labelledby="createOrEditModal" aria-hidden="true" [config]="{ backdrop: 'static', keyboard: !saving }">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <form *ngIf="active" #userForm="ngForm" novalidate autocomplete="off">
                <div class="modal-header">
                    <h4 class="modal-title">
                        <span>交货确认申请单</span>
                    </h4>
                    <button type="button" class="close" (click)="close()" [attr.aria-label]="l('Close')" [disabled]="saving">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body" style="height: 500px; overflow: auto;">
                    <p-tabView [activeIndex]="index" (onChange)="handleChange($event)">
                        <p-tabPanel header="加工单筛选">
                            <div style="border: 1px solid #c7cdd9;margin-bottom: 10px;border-top-left-radius:4px;border-top-right-radius: 4px;">
                                <div class="col-xl-12" style="padding-right: 0px; padding-left: 0px;">
                                    <div class="form-group m-form__group">
                                        <div class="input-group">
                                            <input [(ngModel)]="filterText" name="filterText" autoFocus style="border-right: none;"
                                                class="form-control m-input" [placeholder]="l('SearchWithThreeDot')"
                                                type="text">
                                            <span class="input-group-btn">
                                                <button (click)="getTasks()" class="btn btn-primary"><i class="flaticon-search-1"
                                                        [attr.aria-label]="l('Search')"></i></button>
                                            </span>
                                        </div>
                                    </div>
                                </div>
                                <div class="row" style="overflow: auto;">
                                    <div class="align-items-center">
                                        <!--<Primeng-TurboTable-Start>-->
                                        <div class="primeng-datatable-container">
                                            <p-table #dataTable [value]="primengTableHelper.records" rows="{{primengTableHelper.defaultRecordsCountPerPage}}"
                                                [paginator]="false" [lazy]="true" [scrollable]="true" ScrollWidth="100%"
                                                [responsive]="primengTableHelper.isResponsive" [resizableColumns]="primengTableHelper.resizableColumns">
                                                <ng-template pTemplate="header">
                                                    <tr>
                                                        <th style="width: 50px">
                                                            操作
                                                        </th>
                                                        <th style="width: 150px">
                                                            申请单编号
                                                        </th>
                                                        <th style="width: 150px">
                                                            加工单编号
                                                        </th>
                                                        <th style="width: 150px">
                                                            申请单位
                                                        </th>
                                                        <th style="width: 150px">
                                                            合格供方单位
                                                        </th>
                                                    </tr>
                                                </ng-template>
                                                <ng-template pTemplate="body" let-record="$implicit">
                                                    <tr>
                                                        <td style="width: 50px">
                                                            <button pButton type="button" icon="pi pi-plus" class="ui-button-info"
                                                                style="margin-right: .5em" (click)="SelectTask(record)"></button>
                                                        </td>
                                                        <td style="width: 150px">
                                                            {{record.requisitionCode}}
                                                        </td>
                                                        <td style="width: 150px">
                                                            {{record.orderCode}}
                                                            <h6>
                                                                <font style="vertical-align: inherit;">

                                                                    <span class="m--font-metal" *ngIf="record.isEnd === 0">
                                                                        进行中 </span>
                                                                    <span class="m--font-metal" *ngIf="record.isEnd === 1">
                                                                        完成 </span>
                                                                </font>
                                                            </h6>

                                                        </td>
                                                        <td style="width: 150px">
                                                            {{record.applyUnit}}
                                                        </td>
                                                        <td style="width: 150px">
                                                            {{record.supplierUnit}}
                                                        </td>

                                                    </tr>
                                                </ng-template>
                                            </p-table>
                                            <div class="primeng-no-data" *ngIf="primengTableHelper.totalRecordsCount == 0">
                                                {{'NoData' | localize}}
                                            </div>
                                            <div class="primeng-paging-container">
                                                <p-paginator [rows]="primengTableHelper.defaultRecordsCountPerPage"
                                                    #paginator (onPageChange)="getTasks($event)" [totalRecords]="primengTableHelper.totalRecordsCount">
                                                </p-paginator>
                                                <span class="total-records-count">
                                                    {{'TotalRecordsCount' |
                                                    localize:primengTableHelper.totalRecordsCount}}
                                                </span>
                                            </div>
                                        </div>

                                        <!--<Primeng-TurboTable-End>-->
                                    </div>
                                </div>
                            </div>
                        </p-tabPanel>
                        <p-tabPanel header="外包加工单">
                            <div class="align-items-center">
                                <div class="align-items-center" style="border: 1px solid #c7cdd9;padding: 0.571em 1em; ">
                                    <div class="row">
                                        <div class="form-group col-md-2">
                                            <label for="productionUnit">生产单位</label>
                                        </div>
                                        <div class="form-group col-md-10">
                                            <input id="productionUnit" #productionUnitInput="ngModel" type="text" name="productionUnit"
                                                class="form-control" [(ngModel)]="_processingDelivery.productionUnit"
                                                required maxlength="256" />
                                            <validation-messages [formCtrl]="productionUnitInput">
                                            </validation-messages>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="form-group col-md-2">
                                            <label for="supplierUnit">供方单位 *</label>
                                        </div>
                                        <div class="form-group col-md-10">
                                            <input id="supplierUnit" #supplierUnitInput="ngModel" type="text" name="supplierUnit"
                                                class="form-control" [(ngModel)]="_processingDelivery.supplierUnit"
                                                required maxlength="256" />
                                            <validation-messages [formCtrl]="supplierUnitInput">
                                            </validation-messages>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="form-group col-md-2">
                                            <label for="requisitionCode">申请单编号</label>
                                        </div>
                                        <div class="form-group col-md-10">
                                            <input id="requisitionCode" #requisitionCodeInput="ngModel" type="text"
                                                name="requisitionCode" class="form-control" [(ngModel)]="_processingDelivery.requisitionCode"
                                                disabled maxlength="256" />
                                            <validation-messages [formCtrl]="requisitionCodeInput">
                                            </validation-messages>
                                        </div>
                                    </div>
                                    <div class="row">
                                            <div class="form-group col-md-2">
                                                <label for="orderCode">加工单编号</label>
                                            </div>
                                            <div class="form-group col-md-10">
                                                <input id="orderCode" #orderCodeInput="ngModel" type="text"
                                                    name="orderCode" class="form-control" [(ngModel)]="_processingDelivery.orderCode"
                                                    disabled maxlength="256" />
                                            </div>
                                        </div>
                                    <div class="row">
                                        <div class="form-group col-md-2">
                                            <label for="requisitionCode">确认单编号</label>
                                        </div>
                                        <div class="form-group col-md-10">
                                            <input id="deliveryCode" type="text" name="deliveryCode" class="form-control"
                                                [(ngModel)]="_processingDelivery.deliveryCode" disabled maxlength="256" />
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div style="border: 1px solid #c7cdd9;margin-bottom: 10px;border-top-left-radius:4px;border-top-right-radius: 4px;margin-top: 20px;">
                                <div class="row" style="overflow: auto;">
                                    <div class="align-items-center">
                                        <!--<Primeng-TurboTable-Start>-->
                                        <div class="primeng-datatable-container">
                                            <p-table #teskdataTable [value]="detailsprimengTableHelper.records" rows="{{primengTableHelper.defaultRecordsCountPerPage}}"
                                                editMode='row' dataKey="taskForModelId" [paginator]="false" [lazy]="true"
                                                [scrollable]="true" ScrollWidth="100%">
                                                <ng-template pTemplate="header">
                                                    <tr>
                                                        <th style="width: 100px">
                                                            操作</th>
                                                        <th style="width: 150px">
                                                            任务号
                                                        </th>
                                                        <th style="width: 150px">
                                                            产品图号
                                                        </th>
                                                        <th style="width: 150px">
                                                            产品名称
                                                        </th>
                                                        <th style="width: 80px">
                                                            加工数量
                                                        </th>
                                                        <th style="width: 130px">
                                                            进度要求
                                                        </th>
                                                        <th style="width: 100px">
                                                            已交货数量
                                                        </th>
                                                        <th style="width: 120px">
                                                            验收数量
                                                        </th>
                                                        <th style="width: 130px">
                                                            验收日期
                                                        </th>
                                                        <th style="width: 120px">
                                                            合格数量
                                                        </th>
                                                        <th style="width: 120px">
                                                            超差数量
                                                        </th>
                                                        <th style="width: 120px">
                                                            报废数量
                                                        </th>
                                                        <th style="width: 200px">
                                                            质控卡编号
                                                        </th>
                                                        <th style="width: 80px">
                                                            是否逾期
                                                        </th>
                                                        <th style="width: 80px">
                                                            逾期天数
                                                        </th>
                                                        <th style="width: 200px">
                                                            备注
                                                        </th>
                                                    </tr>
                                                </ng-template>
                                                <ng-template pTemplate="body" let-record let-editing="editing" let-ri='rowIndex'>
                                                    <tr [pEditableRow]='record'>
                                                        <td style="width: 100px">
                                                            <button *ngIf="!editing" pButton type="button"
                                                                pInitEditableRow icon="pi pi-pencil" [disabled]='record.deliveredAmount >= record.processingAmount'
                                                                class="ui-button-info" (click)="onRowEditInit(record)"></button>
                                                            <button *ngIf="editing" pButton type="button"
                                                                pSaveEditableRow icon="pi pi-check" class="ui-button-success"
                                                                style="margin-right: .5em" (click)="onRowEditSave(record)"></button>
                                                            <button *ngIf="editing" pButton type="button"
                                                                pCancelEditableRow icon="pi pi-times" class="ui-button-danger"
                                                                (click)="onRowEditCancel(record, ri)"></button>
                                                        </td>
                                                        <td style="width: 150px">
                                                            {{record.taskCode}}
                                                        </td>
                                                        <td style="width: 150px">
                                                            {{record.picNo}}
                                                        </td>
                                                        <td style="width: 150px">
                                                            {{record.taskName}}
                                                        </td>
                                                        <td style="width: 80px">
                                                            {{record.processingAmount}}
                                                        </td>
                                                        <td style="width: 130px">
                                                            {{record.progressrequest | momentFormat:'L'}}
                                                        </td>
                                                        <th style="width: 100px">
                                                            {{record.deliveredAmount}}
                                                        </th>
                                                        <td style="width: 120px">
                                                            {{record.passedAmount + record.quantityAmount +
                                                            record.noPassedAmount}}
                                                            <!-- <p-cellEditor>
                                                                <ng-template pTemplate="input">
                                                                    <p-spinner size="6"  name="deliveryAmount" #deliveryAmountInput="ngModel" [(ngModel)]="record.deliveryAmount" [min]="0" [max]="record.processingAmount" required></p-spinner>
                                                                    <validation-messages [formCtrl]="deliveryAmountInput"></validation-messages>
                                                                </ng-template>
                                                                <ng-template pTemplate="output">
                                                                    {{record.deliveryAmount}}
                                                                </ng-template>
                                                            </p-cellEditor>  -->
                                                        </td>
                                                        <td style="width: 130px">
                                                            <p-cellEditor>
                                                                <ng-template pTemplate="input">
                                                                    <input pInputText type="text" style='width:120px;'
                                                                        name='deliveryDate' #deliveryDateInput="ngModel"
                                                                        [(ngModel)]="record.deliveryDate" required
                                                                        bsDatepicker>
                                                                    <validation-messages [formCtrl]="deliveryDateInput">
                                                                    </validation-messages>
                                                                </ng-template>
                                                                <ng-template pTemplate="output">
                                                                    {{record.deliveryDate | momentFormat:'L'}}
                                                                </ng-template>
                                                            </p-cellEditor>
                                                        </td>
                                                        <td style="width: 120px">
                                                            <p-cellEditor>
                                                                <ng-template pTemplate="input">
                                                                    <p-spinner size="6" name="passedAmount"
                                                                        #passedAmountInput="ngModel" [(ngModel)]="record.passedAmount"
                                                                        [min]="0" [max]="record.processingAmount - record.deliveredAmount"
                                                                        required></p-spinner>
                                                                    <validation-messages [formCtrl]="passedAmountInput"></validation-messages>
                                                                </ng-template>
                                                                <ng-template pTemplate="output">
                                                                    {{record.passedAmount}}
                                                                </ng-template>
                                                            </p-cellEditor>
                                                        </td>
                                                        <td style="width: 120px">
                                                            <p-cellEditor>
                                                                <ng-template pTemplate="input">
                                                                    <p-spinner size="6" name="quantityAmount"
                                                                        #quantityAmountInput="ngModel" [(ngModel)]="record.quantityAmount"
                                                                        [min]="0" [max]="record.processingAmount - record.deliveredAmount"
                                                                        required></p-spinner>
                                                                    <validation-messages [formCtrl]="quantityAmountInput"></validation-messages>
                                                                </ng-template>
                                                                <ng-template pTemplate="output">
                                                                    {{record.quantityAmount}}
                                                                </ng-template>
                                                            </p-cellEditor>
                                                        </td>
                                                        <td style="width: 120px">
                                                            <p-cellEditor>
                                                                <ng-template pTemplate="input">
                                                                    <p-spinner size="6" name="noPassedAmount"
                                                                        #noPassedAmountInput="ngModel" [(ngModel)]="record.noPassedAmount"
                                                                        [min]="0" [max]="record.processingAmount - record.deliveredAmount"
                                                                        required></p-spinner>
                                                                    <validation-messages [formCtrl]="noPassedAmountInput"></validation-messages>
                                                                </ng-template>
                                                                <ng-template pTemplate="output">
                                                                    {{record.noPassedAmount}}
                                                                </ng-template>
                                                            </p-cellEditor>
                                                        </td>
                                                        <td style="width: 200px">
                                                            <p-cellEditor>
                                                                <ng-template pTemplate="input">
                                                                    <input pInputText type="text" style='width:180px;'
                                                                        #qualityControlCardNoInput="ngModel" name='qualityControlCardNo'
                                                                        [(ngModel)]="record.qualityControlCardNo"
                                                                        required>
                                                                    <validation-messages [formCtrl]="qualityControlCardNoInput">
                                                                    </validation-messages>
                                                                </ng-template>
                                                                <ng-template pTemplate="output">
                                                                    {{record.qualityControlCardNo}}
                                                                </ng-template>
                                                            </p-cellEditor>
                                                        </td>
                                                        <td style="width: 80px">
                                                            {{record.isOverdue == true ? "是" : "否"}}
                                                        </td>
                                                        <td style="width: 80px">
                                                            {{record.overdueDay}}
                                                        </td>
                                                        <td style="width: 200px">
                                                            <p-cellEditor>
                                                                <ng-template pTemplate="input">
                                                                    <input pInputText type="text" style='width:180px;'
                                                                        name='remarks' [(ngModel)]="record.remarks"
                                                                        required>
                                                                </ng-template>
                                                                <ng-template pTemplate="output">
                                                                    {{record.remarks}}
                                                                </ng-template>
                                                            </p-cellEditor>
                                                        </td>
                                                    </tr>
                                                </ng-template>
                                            </p-table>
                                            <div class="primeng-no-data" *ngIf="detailsprimengTableHelper.totalRecordsCount == 0">
                                                {{'NoData' | localize}}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </p-tabPanel>
                        <p-tabPanel header="审批人">
                            <div style="border: 1px solid #c7cdd9;padding: 0.571em 1em; ">
                                <div class="row">
                                    <div class="form-group col-md-4">
                                        <label for="Code">质量处主管 </label>
                                    </div>
                                    <div class="form-group col-md-8">
                                        <span>{{selectedCar3}}</span>
                                        <p-dropdown [options]="users" name='qualityDepartmentManager' [(ngModel)]="stepusers.qualityDepartmentManager"
                                            [filter]='true'>

                                        </p-dropdown>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="form-group col-md-4">
                                        <label for="Code">车间主管 </label>
                                    </div>
                                    <div class="form-group col-md-8">
                                        <span>{{selectedCar3}}</span>
                                        <p-dropdown [options]="users" name='workShopManager' [(ngModel)]="stepusers.workShopManager"
                                            [filter]='true'>

                                        </p-dropdown>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="form-group col-md-4">
                                        <label for="Code">车间领导 </label>
                                    </div>
                                    <div class="form-group col-md-8">
                                        <span>{{selectedCar3}}</span>
                                        <p-dropdown [options]="users" name='workShopLeader' [(ngModel)]="stepusers.workShopLeader"
                                            [filter]='true'>

                                        </p-dropdown>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="form-group col-md-4">
                                        <label for="Code">质量管理处处长 </label>
                                    </div>
                                    <div class="form-group col-md-8">
                                        <span>{{selectedCar3}}</span>
                                        <p-dropdown [options]="users" name='qualityDepartmentLeader' [(ngModel)]="stepusers.qualityDepartmentLeader"
                                            [filter]='true'>

                                        </p-dropdown>
                                    </div>
                                </div>
                            </div>
                        </p-tabPanel>
                    </p-tabView>
                </div>
                <div class="modal-footer">
                    <button [disabled]="saving" type="button" class="btn btn-default" (click)="close()">
                        取消
                    </button>
                    <button type="submit" (click)="save()" class="btn btn-primary2" [disabled]="!userForm.form.valid"
                        [buttonBusy]="saving" [busyText]="l('SavingWithThreeDot')">
                        <i class="fa fa-save"></i> <span>申请</span>
                    </button>
                </div>
            </form>
        </div>
    </div>




</div>
